<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<html>
<head>
	<title>角色管理</title>	
	<script>
		 $(function () { $('.popover-hide').popover('hide');});
	</script>
	
</head>

<body>	
	
	<div class="main-content-inner">
		<!-- #section:basics/content.breadcrumbs -->
		<div class="breadcrumbs" id="breadcrumbs">
			<script type="text/javascript">
				try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
			</script>
	
			<ul class="breadcrumb">
				<li>
					<i class="ace-icon fa fa-home home-icon"></i>
					<a href="${ctx}/welcome">主页</a>
				</li>
				<li class="active">角色列表</li>
			</ul><!-- /.breadcrumb -->
	
			<!-- #section:basics/content.searchbox -->
			<div class="nav-search" id="nav-search">
				<form class="form-search" action="${ctx}/role/list" method="GET">
					<span class="input-icon">
						<input type="text" autocomplete="off" name="search_LIKE_rolename" placeholder="角色名称" class="nav-search-input" id="nav-search-input" autocomplete="off" value="${param.search_LIKE_rolename}" />
						<i class="ace-icon fa fa-search nav-search-icon" onclick="$('.form-search').submit();"></i>
					</span>
					<span class="input-icon">
						<select class="nav-search-input" id="role_deltag" name="search_EQ_deltag" data-placeholder="请选择">					
<!-- 							<option value="" selected="selected">请选择</option> -->
							<option value="0" <c:if test="${param.search_EQ_deltag eq '0' }">selected="selected"</c:if>>可用</option>
							<option value="1" <c:if test="${param.search_EQ_deltag eq '1' }">selected="selected"</c:if>>禁用</option>
						</select>
					</span>
					
					<input type="button" value="搜索" onclick = "$('.form-search').submit();" />
				</form>
			</div><!-- /.nav-search -->
	
			<!-- /section:basics/content.searchbox -->
		</div>	
		<!-- /section:basics/content.breadcrumbs -->
		
		<div class="page-content">
			
			<c:if test="${not empty message}">
				<div id="message" class="alert alert-success"><button data-dismiss="alert" class="close">×</button>${message}</div>
			</c:if>	
			
			<div class="page-header">
				<h1>
					角色管理					
				</h1>
				
			</div><!-- /.page-header -->			
			
			<div class="row">
				<div class="col-xs-12">
					<!-- PAGE CONTENT BEGINS -->
					
					<table id="sample-table-1" class="table table-striped table-bordered table-hover">
						<thead>
							<tr>
								<th class="center">
									<label class="position-relative">
										<input type="checkbox" id="id-toggle-all" class="ace" />
										<span class="lbl"></span>
									</label>
								</th>
								<th>角色名称</th>
								<th>角色描述</th>
								<th>权限</th>
								<th>是否可用</th>
								<th>创建时间</th>
								<th>管理</th>
							</tr>
						</thead>

						<tbody>
							<c:forEach items="${roles.content}" var="role">
							<tr>
								<td class="center">
									<label class="position-relative">
										<input type="checkbox" class="ace" />
										<span class="lbl"></span>
									</label>
								</td>

								<td>
									${role.rolename}
								</td>	
								
								<td>
									<span title="${role.description}">
										<c:choose>
											<c:when test="${fn:length(role.description)>20 }">
												<c:out value="${fn:substring(role.description,0,20)}......"></c:out>
<%-- 												<input hidden="hidden" type="text" value="${role.description}"/> --%>
<%-- 												<a href="#" class="a a popover-hide" title="角色描述" data-container="body" data-toggle="popover" data-placement="top"  data-content="${role.description}"><c:out value="${fn:substring(role.description,0,20)}......"></c:out></a> --%>
											</c:when>
											<c:otherwise>
												${role.description}
											</c:otherwise>
										</c:choose>
									</span>
								</td>
								
								<td>
									<a href="${ctx}/rolepermission/accredit?roleid=${role.id}">查看</a>
								</td>

								<td>
									<c:if test="${role.deltag eq '0' }">可用</c:if>
									<c:if test="${role.deltag eq '1' }">不可用</c:if>
								</td>	
								
								<td>
									<fmt:formatDate value="${role.createdate}" pattern="yyyy年MM月dd日  HH时mm分ss秒" />
								</td>
									
								<td>
									<c:if test="${role.rolename != 'admin' }">
										<a class="btn btn-xs btn-info" href="${ctx}/role/update/${role.id}">
											修改
										</a>
									</c:if>
									<c:if test="${role.deltag eq '0' && role.rolename != 'admin'}">									
										<a class="btn btn-xs btn-danger" href="${ctx}/role/delete/${role.id}">
											禁用
										</a>
									</c:if> 
									<c:if test="${role.deltag eq '1' }">
										<a class="btn btn-xs btn-danger" href="${ctx}/role/recover/${role.id}">
											可用
										</a>
									</c:if>
								</td>									
							</tr>
							</c:forEach>
						</tbody>
					</table>
							
				</div>
			</div>
			
			<tags:pagination page="${roles}" paginationSize="5"/>
		
			<div style="clear:right"><a class="btn btn-info" href="${ctx}/role/createform">新增角色</a></div>
		</div><!-- /.page-content -->
	</div>
</body>
</html>
<!-- inline scripts related to this page -->
<script type="text/javascript">
	jQuery(function($){
		//check/uncheck all messages
		//$('#id-toggle-all').removeAttr('checked').on('click', function(){
		//	if(this.checked) {
		//		Inbox.select_all();
		//	} else Inbox.select_none();
		//});
		
	});
	
</script>		